<template>
  <div class="HomeHeader">
    <div class="headerLeft">xx</div>
    <div class="headerContent">
      <span @click="$router.push('/mineview')">我的</span>
      <span class="active" @click="$router.push('/findview')">发现</span>
      <span @click="$router.push('/yuncunview')">云村</span>
      <span @click="$router.push('/medioview')">视频</span>
    </div>
    <div class="headerRight" @click="$router.push('/searchview')">xx</div>
  </div>

</template>

<script>
export default {};
</script>

<style lang="less" scoped>
    .HomeHeader{
        width: 100%;
        height: 1rem;
        padding: .2rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .headerContent{
            width: 65%;
            height: 100%;
            display: flex;
            justify-content: space-around;
            // align-items: center;
            font-size: .36rem;
            .active{
                font-weight: 900;
            }
        }
    }
</style>